<template>
	<view class="content">
        <!-- navbar -->
        <u-navbar bgColor="#fff" :fixed="true" :shadow="true" :safeAreaInsetTop="true" :placeholder="true"
            @leftClick="back" title="专户管理">
        </u-navbar>

        <view class="uni-area">
            <!-- 工资专户概览 -->
            <view class="u-m-t-50 u-font-32 font-bold">工资专户概览</view>
            <uni-item-base class="u-m-t-30 u-p-t-10" :baseData="total" />

            <!-- 工资专户、保证金专户 -->
            <view class="u-m-t-50 u-flex u-flex-wrap u-row-between wage">
                <view v-for="(item,index) in wages" :key="index" 
                    class="u-font-32 font-bold u-p-l-30 u-p-t-30 item" :style="{background:'url('+item.bg+')'}"
                    @tap="skip(item.url)" >
                    {{item.title}}
                </view>
            </view>
        </view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
                // 专户统计
                total:{
                    line: false,
                    title: '',
                    rightText: '',
                    list:[
                        { filed:'account', title:'专户数', value:'', unit:'个' },
                        { filed:'balance', title:'拨付金额', value:'', unit:'万元' },
                        { filed:'disburse', title:'发放金额', value:'', unit:'万元' },
                        { filed:'salary', title:'专户余额', value:'', unit:'万元' },
                    ]
                },
                // 工资专户、保证金专户
                wages:[
                    { title:'工资专户',  bg:'/static/home/bg9.png',url:'/pages/fohf-bag/wage'},
                    { title:'保证金专户', bg:'/static/home/bg10.png',url:'/pages/fohf-bag/bzjList' },
                ],
			}
		},

		onLoad() {
            // 专户统计
            this.getFohfAccStatistics()
		},
    
		methods: {
            // 返回
            back(){
                uni.navigateBack()
            },
            // 搜索
            rightClick(){
                uni.navigateTo({ url: '/pages/common/search?type=fohf' })
            },
            // 跳转
            skip(url){
                uni.navigateTo({ url: url })
            },


            // 专户统计
            getFohfAccStatistics(){
                this.$request(this,this.$apis.fohfAccStatistics,{}).then(res=>{
                    // console.log('专户统计',res)
                    this.total.list.map((v,i)=>{
                        v.value = res[v.filed]
                    })
                }).then()
            }
		}
	}
</script>

<style scoped lang="scss">
    .content{
        // 工资专户
        .wage{
            .item{
                width: 334rpx;
                height: 150rpx;
                border-radius: 16rpx;
                background-repeat: no-repeat !important;
                background-size: cover !important;
            }
        }
    }
</style>
